<template>
     <view class="content">
          <div class="herd"></div>
          <!-- 公司 -->
          <div class="haibao" v-show="comIsDiy && !createdType">
               <div class="haibao-top">
                    <div class="haitetx">
                         <h3>众邦郑州</h3>
                         <p>创业顾问</p>
                         <!-- <p>郑州市管城区航海东路启航大厦E座1012</p> -->
                    </div>
                    <div class="haiimage">
                         <view  @click="haibao">
                              <span>海报</span>
                              <image :src="imgHost + '/index/erwm.png'"></image>
                         </view>
                         <view>
                              <image src="../static/logo2.png" mode=""></image>
                         </view>
                    </div>
               </div>
               <div class="haibao-bott">
                    <view>
                         <span>
                              <image :src="imgHost + '/index/iconsj.png'" mode=""></image>
                              <span>0371-66566999</span>
                         </span>
                         <span></span>
                    </view>
                    <view>
                         <span>  
                              <image :src="imgHost + '/index/dinwe.png'" mode=""></image>
                              <span>郑州市管城区航海东路启航大厦E座1012</span>
                         </span>
                         <span>
                              <!-- <image :src="imgHost + '/index/right.png'" mode=""></image> -->
                         </span>
                    </view>
                    <view>
                         <span>
                              <image :src="imgHost + '/index/ement.png'" mode=""></image>
                              <span>lixiang@crmeb.cc</span>
                         </span>
                         <span>
                              <image :src="imgHost + '/index/right.png'" mode=""></image>
                         </span>
                    </view>
               </div>
          </div>
          <!-- 信息 -->
          <div class="haibao" v-if="createdType && xinxilist.mb_type==0">
               <div class="haibao-top">
                    <div class="haitetx">
                         <h3>{{xinxilist.nickname}}</h3>
                         <p>{{xinxilist.position_name==null?'':xinxilist.position_name}}</p>
                         <p>{{qiyexx.name}}</p>
                    </div>
                    <div class="haiimage">
                         <view @click="haibao">
                              <span>海报</span>
                              <image :src="imgHost + '/index/erwm.png'"></image>
                         </view>
                         <view>
                              <image :src="xinxilist.avatar" mode=""></image>
                         </view>
                    </div>
               </div>
               <div class="haibao-bott">
                    <view>
                         <span>
                              <image :src="imgHost + '/index/iconsj.png'" mode=""></image>
                              <span>{{xinxilist.phone}}</span>
                         </span>
                         <span></span>
                    </view>
                    <view @click="openMap">
                         <div class="onetext">
                              <span>
                                   <image :src="imgHost + '/index/dinwe.png'" mode=""></image>
                              </span>
                              <span>{{qiyexx.address}}</span>
                         </div>
                         <span>
                              <image :src="imgHost + '/index/right.png'" mode=""></image>
                         </span>
                         <!--                         <input placeholder="请选择地址..." value="{{mapName}}"></input> -->
                    </view>
                    <view>
                         <span>
                              <image :src="imgHost + '/index/ement.png'" mode=""></image>
                              <span>{{xinxilist.email}}</span>
                         </span>
                         <span>
                              <!-- <image :src="imgHost + '/index/right.png'" mode=""></image> -->
                         </span>
                    </view>
               </div>
          </div>
          <div class="haibao-two" v-if="createdType && xinxilist.mb_type==1">
               <div class="moban" style="height: 400rpx; background-color: #eee;margin-top:20rpx;">
                    <image :src="xinxilist.mb_img1" style="width: 100%;height: 100%;" mode="aspectFill"></image>
               </div>
               <div class="haibao1">
                    <div class="haibao-top1">
                         <div class="haitetx1">
                              <h3>{{xinxilist.nickname}}</h3>
                              <p>{{xinxilist.position_name}}</p>
                         </div>
                         <div class="haiimage1">
                              <view @click="haibao">
                                   <span>海报</span>
                                   <image :src="imgHost + '/index/erwm.png'"></image>
                              </view>
                         </div>
                    </div>
                    <div class="haibao-bott1">
                         <view>
                              <span>
                                   <image :src="imgHost + '/index/iconsj.png'" mode=""></image>
                                   <span>{{xinxilist.phone}}</span>
                              </span>
                              <span></span>
                         </view>
                         <view @click="openMap">
                              <div class="twotext">
                                   <span>
                                        <image :src="imgHost + '/index/dinwe.png'" mode=""></image>
                                   </span>
                                   <span>{{qiyexx.address}}</span>
                              </div>
                              <span>
                                   <image :src="imgHost + '/index/right.png'" mode=""></image>
                              </span>
                         </view>
                         <view>
                              <span>
                                   <image :src="imgHost + '/index/ement.png'" mode=""></image>
                                   <span>{{xinxilist.email}}</span>
                              </span>
                              <!-- <span>
                                   <image :src="imgHost + '/index/right.png'" mode=""></image>
                              </span> -->
                         </view>
                    </div>
               </div>
          </div>
          <div class="h-hanbao2" v-if="createdType && xinxilist.mb_type==2">

               <div class="sbajia"></div>
               <div>
                    <div class="h-text">
                         <div>
                              <h3>{{xinxilist.nickname}}</h3>
                              <p>{{xinxilist.position_name}}</p>
                         </div>
                    </div>
                    <div class="haibao-bott2">
                         <view>
                              <span>
                                   <image :src="imgHost + '/index/iconsj.png'" mode=""></image>
                                   <span>{{xinxilist.phone}}</span>
                              </span>
                         </view>
                         <view @click="openMap">
                              <span>
                                   <image :src="imgHost + '/index/dinwe.png'" mode=""></image>
                                   <span>{{qiyexx.address}}</span>
                              </span>
                         </view>
                         <view>
                              <span>
                                   <image :src="imgHost + '/index/ement.png'" mode=""></image>
                                   <span>{{xinxilist.email}}</span>
                              </span>
                         </view>
                    </div>
               </div>
               <div class="h-img" @click="tiajzp">
                    <div class='herimg' v-if="xinxilist.mb_img ==''">
                         <text class="iconfont">&#xe600;</text>
                         <span>添加照片</span>
                    </div>
                    <image v-else :src="xinxilist.mb_img" mode="aspectFill"></image>
               </div>
          </div>

          <!-- 创建名片 -->
          <div class="minpian">
               <view v-for="(item,index) in minpian" :key="index" @click="dianji(item.ziew)">
                    <image :src="imgHost + item.image" mode=""></image>
                    <span>{{item.text}}</span>
               </view>
          </div>
          <!-- 浏览人 -->
          <view class="liulanr">
               <div>
                    <div class="touxian">
                         <!-- <div v-for="(item,index) in fabulist" :key="index">
                              <image :src="item.avatar" mode=""></image>
                         </div> -->
						 <div v-for="(item,index) in fabulist" :key="index">
						      <image :src="item.avatar" mode=""></image>
						 </div>
                    </div>
               </div>
			   <view class="views-text" >
				   <span>浏览量{{xinxilist.views ? xinxilist.views : 0}}</span>
				   <span style="margin-left: 10rpx;">今日+{{xinxilist.fabulous_today ? xinxilist.fabulous_today : 0}}</span>
			   </view>
               <div class="kaopu" @click="kaopu">
                    <span>靠谱{{!xinxilist.fabulous ?0:xinxilist.fabulous}}</span>
                    <image :src="imgHost + '/dianzan.png'" mode=""></image>
               </div>
          </view>
          <!-- 个性标签 -->
          <view class="biaoqian">
               <div class="bianone">
                    <image :src="imgHost + '/index/zumu.png'" mode=""></image>
                    <span
                         v-if="comIsDiy && !createdType">{{xinxilist.autograph ? xinxilist.autograph : '专注于企业客户关系管理+社交电子商务系统应用场景的研究，分享与交流：社交电商的软件技术、运营知识、实操经验。'}}</span>
                    <span v-else>{{xinxilist.autograph ? xinxilist.autograph : ''}}</span>
               </div>
               <div class="biantwo" v-if="comIsDiy && !createdType">
                    <h3>个性标签</h3>
                    <div class="block">
                         <div class="b-block1" v-for="(item,index) in biao1" :key="index">
                              <span>{{item}}</span>
                         </div>
                    </div>
               </div>
               <div class="biantwo" v-else>
                    <h3>个性标签</h3>
                    <div class="block">
                         <div class="b-block1" v-for="(item,index) in biao" :key="index">
                              <span>{{item}}</span>
                         </div>
                    </div>
               </div>

               <div class="bianthere">
                    <view>
                         <span>企业信息</span>
                         <span @click="goComponeyUrl()">官网 <image :src="imgHost + '/index/right.png'" mode=""></image>
                         </span>
                    </view>
                    <view class="b-block" v-if="comIsDiy && !createdType">
                         <image :src="imgHost + '/index/logo4.png'" mode=""></image>
                         <div class="b-componey">
                              <h3>众邦计算机科技有限公司</h3>
                              <div class="qiye">软件行业</div>
                         </div>
                    </view>
                    <view class="b-block" v-else>
                         <image :src="qiyexx.logo" mode=""></image>
                         <div class="b-componey">
                              <h3>{{qiyexx.name}}</h3>
                              <div class="qiye">软件行业</div>
                         </div>
                    </view>
               </div>
          </view>
		  <!-- 企业视频 -->
		  <div class="video" v-if="qiyeVideo">
		       <p>企业视频</p>
		       <view v-for="(item,index) in qiyeVideo" :key="index" @click="playVideo(item)">
		            <div>
						<image :src="item.image_src"></image>
		            </div>
		            <span class="ospntext" style="flex:1; padding-top:40rpx;">{{item.title}}</span>
		       </view>
		  </div>
          <!-- 热销商品 -->
          <div class="rxspo" v-if="prolist.length>0">
               <p>热销商品</p>
               <view class="leixing" v-for="(item,index) in prolist" :key="index">
                    <div>
                         <image :src="item.image" mode=""></image>
                    </div>
                    <div>
                         <span>{{item.store_name}}</span>
                         <span>￥{{item.price}}</span>
                    </div>
                    <div @click="lijiqg(item)">
                         <text>立即抢购</text>
                    </div>
               </view>
          </div>
          <div class="rxspo" v-show="comIsDiy && !createdType">
               <p>热销商品</p>
               <view class="leixing" v-for="(item,index) in huoqu" :key="index">
                    <div>
                         <image :src="item.image" mode=""></image>
                    </div>
                    <div>
                         <span>{{item.store_name}}</span>
                         <span>￥{{item.price}}</span>
                    </div>
                    <div @click="lijiqg(item)">
                         <text>立即抢购</text>
                    </div>
               </view>
          </div>
          <!-- 推荐热文 -->
          <div class="remeng" v-if="tuijianwz.length > 0">
               <p>推荐热文</p>
               <view v-for="(item,index) in tuijianwz" :key="index" @click="rewtiaoz(item)">
                    <div>
                         <image :src="item.image_input" mode=""></image>
                    </div>
                    <span class="ospntext" style="flex:1; padding-top:40rpx;">{{item.title}}</span>
               </view>
          </div>
          <div class="remeng" v-show="comIsDiy && !createdType">
               <p>推荐热文</p>
               <view v-for="(item,index) in hotlist" :key="index" @click="rewtiaoz(item)">
                    <div>
                         <image :src="item.image_input" mode=""></image>
                    </div>
                    <span class="ospntext" style="flex:1; padding-top:40rpx;">{{item.title}}</span>
               </view>
          </div>

          <!-- 递名片 -->
          <div class="dimp" @click="xzmp">
               <view>递名片</view>
          </div>

            <!-- <div style="height: 250rpx;">
               <view class="nodenllu">
                    <div class="backimg">
                         <view class='text'>您还没登录</view>
                         <span>请先登录再进行此操作</span>
                         <div @click="denlu">立即登录</div>
                         <p @click="$refs.createdPop.close()">暂不登录</p>
                    </div>
               </view>
			</div> -->
          <uni-popup ref="createdIwPop" type="center">
               <view class="oback" @click="showiw">
                    <div class='odivpp'>
                         <image class="oive" :src="imgHost + '/mine/top.png'" mode=""></image>
                         <p>
                              <image :src="imgHost + '/mine/bottom.png'" mode=""></image>
                              点击右上角“ ”，选择添加朋友，粘贴微信号后搜索
                         </p>
                         <p>
                              <image :src="imgHost + '/mine/one.png'" mode=""></image>
                              微信号已复制，点击右上角“ ”退出
                         </p>

                         <image class="oivee" :src="imgHost + '/mine/bott.png'" mode=""></image>
                    </div>
                    <div class="oimage">
                         <image :src="imgHost + '/mine/wxwx.png'" mode=""></image>
                    </div>
               </view>
          </uni-popup>
          <!-- 分享 -->
          <uni-popup ref="iffenxi" type="center">
               <div class="fenxianger">
                    <button class="item" open-type="share" hover-class="none" @click="goFriend">
                         <view class="iconfont icon-weixin3"></view>
                         <view class="">发送给朋友</view>
                    </button>
               </div>
          </uni-popup>
          <odelu ref="odelu"></odelu>
          <tabBar v-if="!is_diy" :pagePath="'/pages/index/minp'"></tabBar>
          <view class="foot">
               <view class="page-footer" id="target" :style="{'background-color':newData.bgColor.color[0].item}">
                    <view class="foot-item" v-for="(item,index) in newData.menuList" :key="index"
                         @click="goRouter(item)">
                         <block v-if="item.link == activeRouter">
                              <image :src="item.imgList[0]"></image>
                              <view class="txt" :style="{color:newData.activeTxtColor.color[0].item}">{{item.name}}
                              </view>
                         </block>
                         <block v-else>
                              <image :src="item.imgList[1]"></image>
                              <view class="txt" :style="{color:newData.txtColor.color[0].item}">{{item.name}}</view>
                         </block>
                         <div class="count-num"
                              v-if="item.link === '/pages/order_addcart/order_addcart' && cartNum > 0">
                              {{cartNum}}
                         </div>
                    </view>
               </view>
          </view>
     </view>
</template>

<script>
     import odelu from '@/components/denlu/denlu.vue'
     import {
          HTTP_REQUEST_URL
     } from '@/config/app.js';
     import {
          card_fab,
          carduser,
          productHot,
		  get_video,
     } from '@/api/userminp.js'
     import {
          getHomeProducts
     } from '@/api/store.js'
     import {
          getArticleHotList
     } from '@/api/api.js'
     import {
          getNavigation
     } from '@/api/public.js'
     import {
          toLogin
     } from '@/libs/login.js';
     import {
          getCustomer
     } from '@/utils/index.js';
     import {
          mapGetters
     } from "vuex";
     import tabBar from "@/pages/index/visualization/components/tabBar.vue";
     export default {
          components: {
               tabBar,
               odelu
          },
          computed: {
               ...mapGetters({
                    isLogin: 'isLogin'
               })
          },
		  // mapGetters(['isLogin'])),
          data() {
               return {
                    latitude: 0, //首次加载维度
                    longitude: 0, //首次加载的经度
                    mapName: "",
                    // 默认获取文章商品列表
                    huoqu: [],
                    hotlist: [],
                    activeRouter: '',
                    fabulist: [],
                    is_diy: uni.getStorageSync('is_diy'),
                    imgHost: HTTP_REQUEST_URL + '/mingpian',
                    // isLogin:false,
                    share_uid: null,
                    prolist: [],
                    tuijianwz: [],
					videoList:[],
					// 企业信息
                    qiyexx: [],
                    xinxie: [],
                    xinxilist: [],
                    shoiwww: false,
                    show: false,
                    biao: [],
                    biao1: ['利他', '感恩', '学习', '真实', '共赢'],
                    newData: {},
                    img: [{
                              image: "/index/token.png",
                         },
                         {
                              image: "/index/token.png",
                         },
                         {
                              image: "/index/token.png",
                         }
                    ],
                    minpian: [{
                              image: '/index/jiajia.png',
                              text: '创建名片',
                              ziew: 0,
                         },
                         {
                              image: '/index/wx.png',
                              text: '微信',
                              ziew: 1,
                         },
                         {
                              image: '/index/duoxuan.png',
                              text: '发消息',
                              ziew: 2,
                         },
                         {
                              image: '/index/iconfj.png',
                              text: '转发名片',
                              ziew: 3,
                         }
                    ],
                    comIsDiy: false,
                    createdType: 0,
                    minusertype: '',
					// 企业id
					qiyeId:null,
					// 企业视频
					qiyeVideo:[],
               }
          },
          onLoad(option) {
               uni.hideTabBar()
               let that = this;
               	if (uni.getStorageSync('FOOTER_BAR')) {
               		uni.hideTabBar()
               	}
               	getNavigation().then(res => {
               		this.newData = res.data
					console.log(this.newData,"123")
               		if (this.newData.status && this.newData.status.status) {
               			uni.hideTabBar()
               		} else {
               			uni.showTabBar()
               		}
               	})
               // uni.hideTabBar()
               // getNavigation().then(res => {
               //      this.newData = res.data
               //      if (this.newData.status && this.newData.status.status) {
               //           uni.hideTabBar()
               //      } else {
               //           uni.showTabBar()
               //      }
               // })
               if (option.share_uid) this.share_uid = option.share_uid;
			   if(option.scene){
				   let params = decodeURIComponent(option.scene);
				   if(params.indexOf('share_uid') != 1){
					   this.share_uid = params.split('=')[1]
				   }
			   }
               // #ifdef MP
               // 小程序静默授权
               if (!this.$store.getters.isLogin) {
                    // Routine.getCode()
                    // 	.then(code => {
                    // 		Routine.silenceAuth(code).then(res => {
                    // 			this.onLoadFun();
                    // 		})
                    // 	})
                    // 	.catch(res => {
                    // 		uni.hideLoading();
                    // 	});
               }
               // #endif

               // #ifdef H5 || APP-PLUS
               if (this.isLogin == false) {
                    toLogin()
               }
               //获取用户信息回来后授权*
               let cacheCode = this.$Cache.get('snsapi_userinfo_code');
               let res1 = cacheCode ? option.code != cacheCode : true;
               if (this.isWeixin && option.code && res1 && option.scope === 'snsapi_userinfo') {
                    this.$Cache.set('snsapi_userinfo_code', option.code);
                    Auth.auth(option.code).then(res => {
                         this.getUserInfo();
                    }).catch(err => {})
               }
               // #endif
               // #ifdef APP-PLUS
               that.$set(that, 'pageHeight', app.globalData.windowHeight);
               // #endif

               let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
               let curRoute = routes[routes.length - 1].route //获取当前页面路由
               this.activeRouter = '/' + curRoute
          },
          onShow() {
			  // 名片信息
               this.getcard_user()
			   // 热销商品
               this.getHome()
			   // 推荐热文
               this.getHotList()
			   // 企业视频
			   this.getVideo()
          },
          onShareAppMessage(e) {
               if (e.from === 'button') {
                    //console.log('来自页面内转发按钮');
               } else if (e.from === 'menu') {
                    //console.log('右上角菜单转发按钮');
               }
               return { // 自定义分享内容
                    title: "AI智能名片",
                    path: `/pages/index/minp?share_uid=` + this.share_uid // 路径，可传递参数到指定页面
               }
          },
          onShareTimeline() {
          		return {
          			title: 'AI智能名片',
          			path: `/pages/index/minp?share_uid=` + this.share_uid,
          			// imageUrl: 'https://cdn.uviewui.com/uview/swiper/1.jpg'
          		};
          	},
          methods: {
			  // 点击跳转推荐热文
               rewtiaoz(item) {
				   console.log(item,"推销热文id")
                    uni.navigateTo({
                         url: '/pages/extension/news_details/index?id=' + item.article_id
                    })
               },
			   // 点击地址
               openMap() {
                    if (this.xinxilist.enterprise && (this.xinxilist.enterprise.latitude != '' && this.xinxilist
                              .enterprise.latitude != '')) {
                         uni.openLocation({
                              latitude: parseFloat(this.xinxilist.enterprise.latitude),
                              longitude: parseFloat(this.xinxilist.enterprise.longitude),
                              name: this.xinxilist.enterprise.address,
                              success: (e) => {
									// console.log("ssss")
									// console.log(e);
                              }
                         })
                    } else {

                    }
               },
				// 默认获取企业视频列表
				getVideo(){
					get_video().then(res=>{
						console.log(res)
					})
				},
               // 默认获取文章商品列表
               getHome() {
                    getHomeProducts().then((res) => {
						// console.log(res.data.list,"res.data.list")
                         this.huoqu = res.data.list.splice(0,5)
                    })
               },
			   // 默认获取推荐热文列表
               getHotList() {
                    getArticleHotList().then((res) => {
                         this.hotlist = res.data.list.splice(0,5)
                    })
               },
			   // 跳转视频播放页面
			   playVideo(item){
				   uni.navigateTo({
						url:"../../webview/playVideo/playVideo?id="+item.id
				   })
			   },
               // 去官网
               goComponeyUrl() {
				   uni.navigateTo({
				        url: '/pages/webview/websub/websub?edit=false&id='+this.share_uid
				   })
               },
               // 递名片
               xzmp() {
                    uni.navigateTo({
                         url: '/pages/userminp/scrollerm/scrollerm?logo=' + this.qiyexx.logo + '&name=' + this.qiyexx.name + '&share=' + this.share_uid+'&natext='+this.xinxilist.nickname+'&zhiye='+this.xinxilist.position_name
                    })
               },
               // 分享
               goFriend(e) {
                    if (e.from === 'button') {
                         //console.log('来自页面内转发按钮');
                    } else if (e.from === 'menu') {
                         //console.log('右上角菜单转发按钮');
                    }
                    return { // 自定义分享内容
                         title: "AI智能名片",
                         path: `/pages/index/minp?share_uid=` + this.share_uid // 路径，可传递参数到指定页面
                    }
                    this.$refs.iffenxi.close()
               },
               // 名片信息
               getcard_user() {
                    let then = this
					if(uni.getStorageSync('USER_INFO')){
						 this.comIsDiy = true;
					}
                    if (!this.isLogin) {
                         this.comIsDiy = true;
                    }
                    if (!this.share_uid && this.isLogin) {
                         this.share_uid = uni.getStorageSync('UID')
                    }
                    carduser({
                         share_uid: this.share_uid
                    }).then((res) => {
						console.log(res.data.mb_type,"res.data.type")
                         if (res.data.type) {
                              this.comIsDiy = false;
                         } else {
                              this.comIsDiy = true;
                         }
						 console.log(res.data,"res.data")
						 if(res.data.enterprise){
							this.qiyeId=res.data.enterprise.id
						 }
						 uni.setStorageSync("QIYEID",res.data.enterprise.id)
						 this.minusertype = res.data.type;
						 this.qiyeVideo=res.data.video_list
                         this.createdType = res.data.type;
                         this.xinxilist = res.data
						 console.log(this.xinxilist,"this.xinxilist")
                         this.fabulist = res.data.fabulous_list
                         this.qiyexx = res.data.enterprise == null ? [] : res.data.enterprise
                         this.biao = JSON.parse(res.data.label_names)
                         this.tuijianwz = res.data.article_list
						 for(var i=0;i<res.data.product_list.length;i++){
							 if(res.data.product_list[i].image.indexOf("http")==-1){
								 res.data.product_list[i].image= HTTP_REQUEST_URL + res.data.product_list[i].image
							 }
						 }
                         this.prolist = res.data.product_list
                         if (this.share_uid != uni.getStorageSync('UID')) {
							 console.log(this.minusertype)
                              if (this.minusertype == 1) {
                                   let baockh = {
                                        image: '/index/jiajia.png',
                                        text: '保存客户',
                                        ziew: 0,
                                   }
                                   this.minpian.splice(0, 1, baockh)
                                   return;
                              }
                              return;
                         }else if (this.xinxilist.type == 1) {
							 console.log("编辑")
                              let osmer = {
                                   image: '/index/jiajia.png',
                                   text: '编辑名片',
                                   ziew: 0,
                              }
                              this.minpian.splice(0, 1, osmer)
                         }else{
							 // let osmer = {
							 //      image: '/index/jiajia.png',
							 //      text: '编辑名片1',
							 //      ziew: 0,
							 // }
							 // this.minpian.splice(0, 1, osmer)
							 // console.log("编辑1")
						 }
                    }).catch(re => {

                    })
               },
			   // 分享
               showiw() {
                    this.$refs.createdIwPop.close()
               },
			   // 立即抢购
               lijiqg(item) {
				   console.log(item.product_id,"id")
                    uni.navigateTo({
                         url: `/pages/goods_details/index?id=${item.product_id}`
                    })
               },
               getifdelu() {
                    uni.showToast({
                         title: '请登录',
                         icon: 'none'
                    })
                    setTimeout(() => {
                         uni.navigateTo({
                              url: '/pages/users/wechat_login/index'
                         })
                    }, 1000)
               },
               // 点赞
               kaopu() {
                    if (!this.isLogin) {
                         this.show = true;
                         return false;
                    }
                    if (this.share_uid != uni.getStorageSync('UID')) {
                         card_fab({
                              z_uid: this.share_uid
                         }).then((res) => {
                              this.getcard_user()
                         })
                    } else {
                         uni.showToast({
                              title: '不能给自己点赞',
                              icon: 'none'
                         })
                    }

               },
			   // 点击海报
               haibao() {
				  //  uni.navigateTo({
						// url: '/pages/userminp/business/business?share=' + this.share_uid + '&name=' +this.qiyexx.name
				  //  })
                    if (this.share_uid != uni.getStorageSync('UID')) {
                         uni.showToast({
                              title: '只能查看自己的名片',
                              icon: 'none'
                         })
                    } else {
						if(!this.minusertype){
							uni.showToast({
							     title: '请先创建名片',
							     icon: 'none'
							})
						}else{
							uni.navigateTo({
							     url: '/pages/userminp/business/business?share=' + this.share_uid + '&name=' +
							          this
							          .qiyexx.name
							})
						}
                    }

               },
			   // 点击名片
               dianji(ziew) {
				   console.log(ziew)
				   console.log(!this.isLogin)
				 //   if(uni.getStorageSync('USER_INFO')){
					// 	 this.isLogin=true
					// }
                    if (!this.isLogin) {
                         // this.show = true;
                         // this.$refs.ifdenlu.open('center')
                         uni.showToast({
                              title: '请登录',
                              icon: 'none'
                         })
                         setTimeout(() => {
                              uni.navigateTo({
                                   url: '/pages/users/wechat_login/index'
                              })
                         }, 1000)
                         return;
                    }
                    if (ziew == 0) {
						console.log("0",this.xinxilist.type)
                         if (this.xinxilist.type == 1) {
							 console.log("1")
                              if (this.share_uid != uni.getStorageSync('UID')) {
								  console.log("2")
                                   if (this.minusertype == 1) {
									   console.log("3")
                                        uni.navigateTo({
                                             url: '/pages/userminp/mine/tianjia/tianjia?share=' + this
                                                  .share_uid,
                                        })
                                   } else {
                                        uni.navigateTo({
                                             url: '/pages/users/wechat_login/index'
                                        })
                                   }
                              } else {
                                   uni.navigateTo({
                                        url: '/pages/userminp/bianjimp/bianjimp',
                                   })
                              }
                         } else {
							 uni.navigateTo({
							 	url: '/pages/userminp/denlu/denlu'
							 })
                              // uni.navigateTo({
                              //      url: '/pages/users/wechat_login/index'
                              // })
                         }
                    }
                    if (ziew == 1) {
                         // 复制电话号
                         uni.setClipboardData({
                              data: this.xinxilist.wechat,
                              success: function() {
                                   uni.showToast({
                                        icon: 'none',
                                        title: '复制成功'
                                   })
                              }
                         })
                         this.$refs.createdIwPop.open('center')
                    }
                    if (ziew == 2) {
                         let url = this.xinxilist.kefu_url
                         if (url) {
                              url = encodeURIComponent(url)
                              uni.navigateTo({
                                   url: `/pages/annex/web_view/index?url=${url}&decode=1`
                              });
                         } else {
                              return getCustomer('')
                         }
                    }
                    if (ziew == 3) {
                         // #ifdef MP
                         this.$refs.iffenxi.open('bottom')
                         // #endif
                         // #ifdef H5
                         uni.navigateTo({
                              url: '/pages/userminp/mpzuf/mpzuf'
                         })
                         // #endif

                    }
               },
               denlu() {
                    toLogin()
               },
               goRouter(item) {
                    var pages = getCurrentPages();
                    var page = (pages[pages.length - 1]).$page.fullPath;
                    if (item.link == page) return
                    uni.navigateTo({
                         url: item.link,
                         fail(err) {
                              uni.redirectTo({
                                   url: item.link
                              })
                         }
                    })
               },
          }
     }
</script>

<style lang="scss">
     .fenxianger {
          background-color: #fff;
          height: 250rpx;

          .item {
               padding: 20rpx;

               .iconfont {
                    font-size: 70rpx;
                    color: green;
               }

               view {
                    font-size: 30rpx;
               }
          }
     }

     .odiver {
          .odictwo {
               padding-top: 100rpx;
               width: 650rpx;
               background-color: #fff;
               border-radius: 25rpx;

               .twimg {
                    position: absolute;
                    top: -50rpx;
                    left: 50rpx;
                    width: 120rpx;
                    height: 120rpx;
                    border: 2rpx solid #fff;
                    border-radius: 100rpx;
                    overflow: hidden;

                    image {
                         width: 100%;
                         height: 100%;
                    }
               }

               .twtext {
                    margin: 0rpx 48rpx;
                    // margin-top: 70rpx;
                    background-color: #f7f8fa;
                    padding: 36rpx 24rpx;
               }

               .annui {
                    display: flex;
                    justify-content: space-between;
                    padding: 40rpx 60rpx;

                    view {
                         padding: 20rpx 60rpx;
                         border-radius: 44rpx;
                    }

                    view:nth-child(1) {
                         border: 2rpx solid #e33c21;
                         color: #e33c21;
                    }

                    view:nth-child(2) {
                         background-color: #e33c21;
                         color: #fff;
                    }
               }
          }
     }

     .oljks {
          width: 640rpx;
          height: 450rpx;
          padding-top: 60rpx;

          .ljdl {
               background-color: #fff;
               border-radius: 25rpx;

               div:nth-child(1) {
                    position: relative;
                    top: -60rpx;
                    left: 60rpx;
                    width: 120rpx;
                    height: 120rpx;

                    image {
                         width: 100%;
                         height: 100%;
                    }
               }

               div:nth-child(2) {
                    background-color: #eee;
                    padding: 20rpx;
                    margin: 0rpx 30rpx;
               }

               div:nth-child(3) {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    padding: 30rpx 100rpx;

                    view:nth-child(1) {
                         background-color: #fff;
                         color: #e33c21;
                         border: 2rpx solid #e33c21;
                    }

                    view {
                         width: 200rpx;
                         height: 80rpx;
                         background-color: #e33c21;
                         color: #fff;
                         font-size: 30rpx;
                         text-align: center;
                         line-height: 80rpx;
                         border-radius: 50rpx;
                    }
               }
          }
     }

     /deep/.u-mode-center-box {
          background-color: transparent;
     }

     .nodenllu {
          width: 654rpx;
          height: 718rpx;

          // background-color: rgba(0, 0, 0, 0.6);
          // background-color: transparent;
          .backimg {
               text-align: center;
               width: 100%;
               height: 718rpx;
               // background-image: url('../static/backdianji.png');
               background-size: 100%;
               background-repeat: no-repeat;
               padding-top: 340rpx;

               .text {
                    margin: auto;
                    font-weight: 600;
                    font-size: 40rpx;
                    line-height: 44rpx;
                    color: #161616;
               }

               span {
                    font-weight: 400;
                    font-size: 28rpx;
                    line-height: 100rpx;
                    color: #999;
               }

               div {
                    margin: auto;
                    width: 464rpx;
                    height: 96rpx;
                    border-radius: 48rpx;
                    background: #e33c21;
                    box-shadow: 0 12rpx 36rpx rgba(193, 0, 0, 0.1);
                    font-weight: 600;
                    font-size: 34rpx;
                    line-height: 96rpx;
                    text-align: center;
                    color: #fff;
               }

               p {
                    display: inline-block;
                    font-weight: 400;
                    font-size: 28rpx;
                    line-height: 44rpx;
                    text-align: left;
                    color: #e33c21;
               }
          }
     }

     .herd {
          width: 100%;
          height: 384rpx;
          background-color: #e33c21;
          border-radius: 0 0 32rpx 32rpx;
          padding-top: 136rpx;
     }

     .haibao {
          height: 464rpx;
          border-radius: 8rpx;
          // background: transparent;
          box-shadow: 0 12rpx 36rpx rgba(0, 0, 0, 0.04);
          margin: 0rpx 30rpx;
          margin-top: -30%;
          background-color: rgba(255, 255, 255, 0.97);

          .haibao-top {
               height: 210rpx;
               padding: 48rpx;
               padding-bottom: 0rpx;
               display: flex;
               justify-content: space-between;

               .haiimage {
                    view:nth-child(1) {
                         text-align: right;

                         image {
                              width: 28rpx;
                              height: 28rpx;
                              vertical-align: middle;
                         }

                         span {
                              margin-right: 6rpx;
                              vertical-align: middle;
                              font-weight: 500;
                              font-size: 30rpx;
                              line-height: 40rpx;
                              text-align: right;
                              color: #595959;
                         }
                    }

                    view:nth-child(2) {
                         margin-top: 20rpx;
                         width: 144rpx;
                         height: 144rpx;
                         overflow: hidden;
                         border-radius: 100rpx;

                         image {
                              width: 100%;
                              height: 100%;
                         }
                    }
               }

               .haitetx {
                    margin-top: 20rpx;

                    h3 {
                         font-weight: 600;
                         font-size: 42rpx;
                         line-height: 80rpx;
                         text-align: left;
                         color: #161616;
                    }

                    p {
                         font-weight: 600;
                         font-size: 22rpx;
                         line-height: 40rpx;
                         text-align: left;
                         color: #a0a0a0;
                    }
               }
          }

          .haibao-bott {
               padding: 48rpx;
               padding-top: 30rpx;

               view:nth-child(3) {
                    span:nth-child(1) {
                         image {
                              width: 24rpx;
                              height: 16rpx;
                         }
                    }
               }

               button {
                    margin-right: 10rpx;
                    width: 35rpx;

                    image {
                         width: 24rpx;
                         height: 26rpx;
                    }
               }

               view {
                    display: flex;
                    justify-content: space-between;
                    // align-items: center;
                    // vertical-align: middle;
                    .onetext{
                         span {
                              margin-top: 10rpx;

                              image {
                                   width: 16rpx;
                                   height: 24rpx;
                                   vertical-align: middle;
                              }

                              span {
                                   font-weight: 600;
                                   font-size: 24rpx;
                                   line-height: 44rpx;
                                   text-align: left;
                                   color: #595959;
                                   vertical-align: middle;
                                   margin-left: 14rpx;
                              }
                         }

                         span {
                              font-weight: 600;
                              font-size: 24rpx;
                              line-height: 44rpx;
                              text-align: left;
                              color: #595959;
                              vertical-align: middle;
                              margin-left: 14rpx;
                         }
                    }
                    span {
                         margin-top: 10rpx;

                         image {
                              width: 16rpx;
                              height: 24rpx;
                              vertical-align: middle;
                         }

                         span {
                              font-weight: 600;
                              font-size: 24rpx;
                              line-height: 44rpx;
                              text-align: left;
                              color: #595959;
                              vertical-align: middle;
                              margin-left: 14rpx;
                         }
                    }

                    span {
                         font-weight: 600;
                         font-size: 24rpx;
                         line-height: 44rpx;
                         text-align: left;
                         color: #595959;
                         vertical-align: middle;
                         margin-left: 14rpx;
                    }
               }
          }
     }

     .minpian {
          margin: 0rpx 54rpx;
          // margin-top: 200rpx;
          height: 208rpx;
          background-color: rgba(255, 255, 255, 1);
          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 0rpx 20rpx;

          view {
               text-align: center;

               image {
                    width: 80rpx;
                    height: 80rpx;
               }

               span {
                    display: block;
                    font-weight: 600;
                    font-size: 24rpx;
                    text-align: center;
                    color: #686868;
               }
          }
     }

     .liulanr {
          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 40rpx 56rpx;

          .kaopu {
               width: 144rpx;
               height: 36rpx;
               border-radius: 18rpx;
               background: transparent;
               text-align: center;

               span {
                    font-weight: 400;
                    font-size: 26rpx;
                    text-align: left;
                    color: #a0a0a0;
               }

               image {
                    margin-left: 10rpx;
                    vertical-align: middle;
                    width: 19rpx;
                    height: 20rpx;
               }
          }

          div:nth-child(1) {
               .touxian {
                    vertical-align: middle;
                    display: inline-block;
                    div {
                         display: inline-block;
                         width: 48rpx;
                         height: 48rpx;
                         border-radius: 100rpx;
                         overflow: hidden;
                         vertical-align: middle;

                         image {
                              width: 100%;
                              height: 100%;
                         }
                    }

					// div:nth-child(1) {
     //                     position: absolute;
     //                     left: 0;
     //                }
                    div:nth-child(2) {
                         // position: absolute;
                         // left: 90rpx;
						 margin-left: -20rpx;
                    }

                    div:nth-child(3) {
                         // position: absolute;
                         // left: 120rpx;

						 margin-left: -20rpx;
                    }
               }

               p {
                    margin-left: 70rpx;
                    vertical-align: middle;
                    display: inline-block;
                    font-weight: 600;
                    font-size: 28rpx;
                    text-align: left;
                    color: #161616;
               }

               span {
                    vertical-align: middle;
                    margin-left: 10rpx;
                    font-weight: 400;
                    font-size: 26rpx;
                    text-align: left;
                    color: #a0a0a0;
               }
          }
		  .views-text{
			  flex: 1;
			  margin-left: 10rpx;
		  }
		  .views-text span:nth-child(1){
			  vertical-align: middle;
			  display: inline-block;
			  font-weight: 600;
			  font-size: 28rpx;
			  text-align: left;
			  color: #161616;
		  }
		  .views-text span:nth-child(2){
			  vertical-align: middle;
			  margin-left: 10rpx;
			  font-weight: 400;
			  font-size: 26rpx;
			  text-align: left;
			  color: #a0a0a0;
		  }
     }

     .biaoqian {
          // width: 100%;
          padding: 48rpx;
          // height: 816rpx;
          border-radius: 8rpx;
          background: #fff;

          .bianone {
               padding-bottom: 60rpx;
               // height: 60rpx;
               display: flex;
               // justify-content: space-between;
               align-items: center;
               border-bottom: 2rpx dashed #eee;

               image {
                    margin-right: 20rpx;
                    width: 30rpx;
                    height: 32rpx;
               }

               span {
                    width: 90%;
                    word-wrap: break-word;
                    line-height: 34rpx;
                    // font-weight: 500;
                    font-size: 24rpx;
                    text-align: left;
                    color: #595959;
               }
          }

          .biantwo {
               padding-bottom: 40rpx;
               border-bottom: 2rpx dashed #eee;
               margin-top: 40rpx;

               h3 {
                    font-weight: 600;
                    font-size: 32rpx;
                    text-align: left;
                    color: #161616;
               }

               .block {
                    display: flex;
                    justify-content: flex-left;
                    align-items: center;
                    flex-wrap: wrap;
                    padding-top: 20rpx;

                    .b-block1 {
                         padding: 20rpx 16rpx 10rpx 0;

                         span {
                              display: inline-block;
                              padding: 10rpx 50rpx;
                              background: #f7f8fa;
                              color: #595959;
                              line-height: 50rpx;
                              border-radius: 30rpx;
                              font-size: 24rpx;
                         }
                    }
               }

               // div {
               // 	padding-top: 40rpx;

               // 	div:nth-child(1) {
               // 		margin-left: 0rpx;
               // 	}

               // 	div {
               // 		margin-top: 16rpx;
               // 		margin-left: 16rpx;
               // 		display: inline-block;
               // 		padding: 0rpx 48rpx;
               // 		height: 65rpx;
               // 		border-radius: 32rpx;
               // 		background: #f7f8fa;

               // 		span {
               // 			text-align: center;
               // 			line-height: 64rpx;
               // 			font-weight: 600;
               // 			font-size: 24rpx;
               // 			text-align: left;
               // 			color: #595959;
               // 		}
               // 	}
               // }
          }

          .bianthere {
               margin-top: 40rpx;

               view:nth-child(1) {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;

                    span:nth-child(1) {
                         font-weight: 600;
                         font-size: 32rpx;
                         text-align: left;
                         color: #161616;
                    }

                    span:nth-child(2) {
                         font-weight: 600;
                         font-size: 24rpx;
                         text-align: right;
                         color: #595959;
                         vertical-align: middle;

                         image {
                              margin-left: 10rpx;
                              vertical-align: middle;
                              width: 14rpx;
                              height: 28rpx;
                         }
                    }
               }

               .b-block {
                    margin-top: 40rpx;
                    display: flex;
                    align-items: center;

                    image {
                         width: 96rpx;
                         height: 96rpx;
                    }

                    .b-componey {
                         margin-left: 20rpx;
                         // display: inline-block;

                         h3 {
                              font-weight: 600;
                              font-size: 32rpx;
                              text-align: left;
                              color: #161616;
                              position: relative;
                              top: -10rpx;
                         }

                         .qiye {
                              margin-top: 16rpx;
                              font-weight: 400;
                              font-size: 22rpx;
                              text-align: left;
                              color: #a0a0a0;
                         }
                    }
               }
          }
     }
     .rxspo {
          margin-top: 20rpx;
          background-color: #fff;
          border-radius: 8rpx;
          padding: 48rpx;

          p {
               font-weight: 600;
               font-size: 32rpx;
               text-align: left;
               color: #161616;
          }

          .leixing {
               margin-top: 40rpx;
               display: flex;
               // align-items: center;

               div:nth-child(1) {
                    width: 150rpx;
                    height: 150rpx;
                    overflow: hidden;
                    border-radius: 15rpx;

                    image {
                         width: 100%;
                         height: 100%;
                    }
               }

               div:nth-child(2) {
                    padding-top: 10rpx;
                    flex: 1;

                    span:nth-child(1) {
                         margin-left: 20rpx;
                         font-weight: 600;
                         font-size: 32rpx;
                         text-align: left;
                         color: #000;
                         height: 38rpx;
                         overflow: hidden;
                         display: -webkit-box;
                         -webkit-line-clamp: 1; //在第几行变为...
                         -webkit-box-orient: vertical;
                         text-overflow: ellipsis;
                    }

                    span:nth-child(2) {
                         margin-left: 20rpx;
                         font-weight: 400;
                         font-size: 34rpx;
                         color: #000;
                         line-height: 80rpx;
                    }

               }

               div:nth-child(3) {
                    margin: 44rpx 5rpx;
                    margin-top: 54rpx;
                    width: 160rpx;
                    height: 54rpx;
                    border-radius: 27rpx;
                    background: #ef8271;
                    text-align: center;

                    text {
                         text-align: center;
                         font-weight: 600;
                         font-size: 26rpx;
                         color: #fff;
                         line-height: 54rpx;
                    }
               }

          }
     }

     .remeng {
          margin-top: 20rpx;
          background-color: #fff;
          border-radius: 8rpx;
          padding: 48rpx;

          p {
               font-weight: 600;
               font-size: 32rpx;
               text-align: left;
               color: #161616;
          }

          view {
               margin-top: 32rpx;
               display: flex;
               // align-items: center;

               div {
                    width: 214rpx;
                    // height: 144rpx;
                    border-radius: 25rpx;
                    overflow: hidden;
                    margin-right: 20rpx;

                    image {
                         width: 150rpx;
                         height: 150rpx;
                    }
               }

               .ospntext {
                    padding-top: 50rpx;
                    font-weight: 600;
                    font-size: 30rpx;
                    text-align: left;
                    color: #161616;
               }
          }
     }
	 .video {
	      margin-top: 20rpx;
	      background-color: #fff;
	      border-radius: 8rpx;
	      padding: 48rpx;

	      p {
	           font-weight: 600;
	           font-size: 32rpx;
	           text-align: left;
	           color: #161616;
	      }

	      view {
	           margin-top: 32rpx;
	           display: flex;
	           // align-items: center;

	           div {
	                width: 214rpx;
	                height: 144rpx;
	                border-radius: 25rpx;
	                overflow: hidden;
	                margin-right: 20rpx;

	                image {
	                     width: 100%;
	                     height: 100%;
	                }
	           }

	           .ospntext {
	                padding-top: 50rpx;
	                font-weight: 600;
	                font-size: 30rpx;
	                text-align: left;
	                color: #161616;
	           }
	      }
	 }


     .dimp {
          // background-color: #fff;
          width: 100%;
          margin-top: 20rpx;
          padding: 40rpx 0rpx;
		  padding-bottom: 200rpx;

          view {
               margin: auto;
               width: 432rpx;
               height: 80rpx;
               border-radius: 40rpx;
               background: #e33c21;
               box-shadow: 0 12rpx 36rpx rgba(193, 0, 0, 0.1);
               font-weight: 600;
               font-size: 34rpx;
               line-height: 44rpx;
               text-align: center;
               color: #fff;
               line-height: 80rpx;
          }
     }

     .oback {
          .odivpp {
               height: 420rpx;
               position: relative;

               .oive {
                    position: absolute;
                    top: 0rpx;
                    right: 0rpx;
                    width: 108rpx;
                    height: 160rpx;

               }

               .oivee {
                    width: 108rpx;
                    height: 160rpx;
                    position: absolute;
                    right: 0rpx;
                    bottom: 0rpx;
               }

               p {
                    position: absolute;
                    top: 30%;
                    font-family: "PingFang SC";
                    font-weight: 400;
                    font-size: 28rpx;
                    line-height: 44rpx;
                    text-align: left;
                    color: #fff;

                    image {
                         width: 40rpx;
                         height: 40rpx;
                         vertical-align: middle;
                    }
               }

               p:nth-child(2) {
                    position: absolute;
                    top: 50%;
               }
          }

          .oimage {
               width: 654rpx;
               height: 776rpx;

               image {
                    width: 100%;
                    height: 100%;
               }
          }
     }

     .haibao-two {

          box-shadow: 0 12rpx 36rpx rgba(0, 0, 0, 0.04);
          margin: 0rpx 30rpx;
          margin-top: -40%;
          background-color: rgba(255, 255, 255, 0.97);

          .moban {
               text {
                    font-size: 100rpx;
               }
          }

          .haibao1 {
               .haibao-top1 {
                    padding: 48rpx;
                    padding-bottom: 0rpx;
                    display: flex;
                    justify-content: space-between;

                    .haiimage1 {
                         padding-top: 15rpx;

                         view:nth-child(1) {
                              text-align: right;

                              image {
                                   width: 28rpx;
                                   height: 28rpx;
                                   vertical-align: middle;
                              }

                              span {
                                   margin-right: 6rpx;
                                   vertical-align: middle;
                                   font-weight: 500;
                                   font-size: 30rpx;
                                   line-height: 40rpx;
                                   text-align: right;
                                   color: #595959;
                              }
                         }

                         view:nth-child(2) {
                              width: 144rpx;
                              height: 144rpx;

                              image {
                                   width: 100%;
                                   height: 100%;
                              }
                         }
                    }

                    .haitetx1 {
                         h3 {
                              font-weight: 600;
                              font-size: 42rpx;
                              line-height: 80rpx;
                              text-align: left;
                              color: #161616;
                         }

                         p {
                              font-weight: 600;
                              font-size: 22rpx;
                              line-height: 40rpx;
                              text-align: left;
                              color: #a0a0a0;
                         }
                    }
               }

               .haibao-bott1 {
                    padding: 48rpx;
                    padding-top: 0rpx;

                    view {
                         display: flex;
                         justify-content: space-between;
                         // align-items: center;
                         .openMap{
                              span {
                                   margin-top: 10rpx;

                                   image {
                                        width: 16rpx;
                                        height: 24rpx;
                                        vertical-align: middle;
                                   }

                                   span {
                                        font-weight: 600;
                                        font-size: 24rpx;
                                        line-height: 44rpx;
                                        color: #595959;
                                        vertical-align: middle;
                                        margin-left: 14rpx;
                                   }
                              }

                              span {
                                   font-weight: 600;
                                   font-size: 24rpx;
                                   line-height: 44rpx;
                                   color: #595959;
                                   vertical-align: middle;
                                   margin-left: 14rpx;
                              }
                         }
                         span {
                              margin-top: 10rpx;

                              image {
                                   width: 16rpx;
                                   height: 24rpx;
                                   vertical-align: middle;
                              }

                              span {
                                   font-weight: 600;
                                   font-size: 24rpx;
                                   line-height: 44rpx;
                                   color: #595959;
                                   vertical-align: middle;
                                   margin-left: 14rpx;
                              }
                         }

                         span {
                              font-weight: 600;
                              font-size: 24rpx;
                              line-height: 44rpx;
                              color: #595959;
                              vertical-align: middle;
                              margin-left: 14rpx;
                         }
                    }
               }
          }
     }

     .h-hanbao2 {
          overflow: hidden;
          margin: 0rpx 30rpx;
          margin-top: -30%;
          display: flex;
          border-radius: 8rpx;
          box-shadow: 0 12rpx 26rpx rgba(0, 0, 0, 0.04);
          background-color: rgba(255, 255, 255, 0.97);
          position: relative;

          .sbajia {
               position: absolute;
               left: 298rpx;
               bottom: 108rpx;
               width: 100rpx;
               height: 338rpx;
               // background: purple;
               transform: perspective(72rpx) rotateX(28deg);

               background-color: #fff;
               z-index: 2;
          }

          div:nth-child(2) {
               z-index: 10;
          }

          div:nth-child(3) {
               z-index: 1;
          }

          .h-text {
               width: 374rpx;
               height: 122rpx;
               background: url('../static/mine/trone.png') no-repeat;
               background-size: 100% 100%;
               padding-top: 12rpx;
               box-sizing: border-box;
               padding-left: 48rpx;

               h3 {
                    font-weight: 600;
                    font-size: 42rpx;
                    line-height: 60rpx;
                    text-align: left;
                    color: #161616;

               }

               p {
                    font-weight: 600;
                    font-size: 22rpx;
                    line-height: 40rpx;
                    text-align: left;
                    color: #a0a0a0;

               }

          }

          .haibao-bott2 {
               padding: 48rpx;
               padding-top: 0rpx;
               margin-bottom: 48rpx;
               z-index: 15;

               view {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;

                    span {
                         margin-top: 10rpx;

                         image {
                              width: 16rpx;
                              height: 24rpx;
                              vertical-align: middle;
                         }

                         span {
                              font-weight: 600;
                              font-size: 20rpx;
                              line-height: 44rpx;
                              text-align: left;
                              color: #595959;
                              vertical-align: middle;
                              margin-left: 14rpx;
                         }
                    }
               }
          }

          .h-img {
               width: 100%;
               height: 100;
               z-index: 10;
               overflow: hidden;

               // margin-top: 28rpx;
               .herimg {
                    text {
                         line-height: 300rpx;
                         margin-left: 150rpx;
                         font-size: 50rpx;
                         // display: block;
                    }

                    span {
                         margin-left: 40rpx;
                         text-align: center;
                         display: block;
                         margin-top: -120rpx;
                    }
               }

               image {
                    width: 100%;
                    height: 100%;
               }
          }
     }

     .page-footer {
          position: fixed;
          bottom: 0;
          z-index: 30;
          display: flex;
          align-items: center;
          justify-content: space-around;
          width: 100%;
          height: calc(98rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
          height: calc(98rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
          box-sizing: border-box;
          border-top: solid 1rpx #F3F3F3;
          background-color: #fff;
          box-shadow: 0px 0px 17rpx 1rpx rgba(206, 206, 206, 0.32);
          padding-bottom: constant(safe-area-inset-bottom); ///兼容 IOS<11.2/
          padding-bottom: env(safe-area-inset-bottom); ///兼容 IOS>11.2/

          .foot-item {
               display: flex;
               width: max-content;
               align-items: center;
               justify-content: center;
               flex-direction: column;
               position: relative;

               .count-num {
                    position: absolute;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    width: 40rpx;
                    height: 40rpx;
                    top: 0rpx;
                    right: -15rpx;
                    color: #fff;
                    font-size: 20rpx;
                    background-color: #FD502F;
                    border-radius: 50%;
                    padding: 4rpx;
               }
          }

          .foot-item image {
               height: 50rpx;
               width: 50rpx;
               text-align: center;
               margin: 0 auto;
          }

          .foot-item .txt {
               font-size: 24rpx;


               &.active {}
          }
     }

     .new-users {
          padding-bottom: 0;
          padding-bottom: constant(safe-area-inset-bottom);
          padding-bottom: env(safe-area-inset-bottom);
     }
</style>
